<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/me.css">
</head>

<body>
    <!-- 头部start -->
    <header>
        <div class="wrap">
            <div class="header-left left clear">
                <img src="./image/logo.PNG" alt="">
                <ul class="right clear">
                    <li><a href="#">发现</a>
                    </li>
                    <li class="hov1"><a href="#">频道</a>
                        <img src="./image/d_a.gif" alt="">
                        <i class="red-1"></i>
                        <i class="red-2"></i>
                    </li>
                    <li class="hov2">
                        <a href="#">我的</a>
                        <!-- <i class="red-1"></i> -->
                        <i class="red-3"></i>
                    </li>
                </ul>
            </div>
            <div class="header-middle left clear">
                <form action="">
                    <input type="text" placeholder="专辑/声音/用户">
                    <img src="../喜马拉雅/image/搜索.PNG" alt="">
                </form>
            </div>
            <div class="header-right right">
                <ul class="clear">
                    <li>
                        <a href="./shangchuanzhongxin.html">
                            <img src="./image/nav-1.PNG" alt="">
                            <p> 上传</p>
                        </a>
                    </li>
                    <li>
                        <img src="./image/nav-2.PNG" alt="">
                        <p>创作中心</p>
                    </li>
                    <li>
                        <a href="./youshengshuchuban.html">
                            <img src="./image/nav-3.PNG" alt="">
                            <p>有声出版</p>
                        </a>
                    </li>
                    <li>
                        <img src="./image/nav-4.PNG" alt="">
                        <p>客户端</p>
                    </li>
                    <li>
                        <a href="./denglu.html"><img src="./img-me/header-4.jpg" alt="" class="denglu img"></a>
                    </li>
                </ul>
            </div>
        </div>
    </header>
    <!-- 头部end -->
    <!-- main start -->
    <main>
        <div class="left main-left clear">
            <div class="left main-F">
                <img src="./img-me/header-4.jpg" alt="">
            </div>
            <div class="left main-S">
                <h1>佚名 </h1>
                <h3>
                    大作业啦！
                </h3>
            </div>
        </div>
        <div class="right main-right clear">
            <p class="left">
            </p><span class="left">Podcast服务</span>
        </div>
    </main>
    <!-- main end -->
    <!-- 内容start -->
    <div class="content clear">
        <div class="cont-left left">
            <div class="con-f">
                <h2>我的专辑(1)</h2>
                <img src="./img-me/播放器.jpg" alt="">
                <div class="zanting"></div>
                <div class="erji">
                    <img src="./img-me/耳机.png" alt=""><span>28</span>
                </div>
                <div class="h4">配音专辑</div>
            </div>
            <div class="con-s clear">
                <div class="cons-left left">
                    <h2>我的声音(2)</h2>
                    <img src="./img-me/音乐盘.png" alt="">
                    <div class="cons-1"></div>
                    <div class="cons-2"></div>
                </div>
                <div class="cons-middle left">
                    <p><span>第一节</span> &nbsp;&nbsp;&nbsp;&nbsp;
                        <img src="./img-me/摄像.png" alt="">
                    </p>
                    <p>动漫配音</p>
                    <p><img src="./img-me/时钟.png" alt=""><span>00：16</span> &nbsp;&nbsp;&nbsp;&nbsp;<img src="./img-me/耳机1.png" alt=""><span>0</span></p>
                </div>
                <div class="cons-right right">
                    <p>一年前</p>
                    <ul>
                        <li>
                            <img src="./img-me/收 藏-产品详情.png" alt="">
                        </li>
                        <li> <img src="./img-me/转发.png" alt=""></li>
                        <li> <img src="./img-me/信息.png" alt=""></li>
                        <li> <img src="./img-me/添加.png" alt=""></li>
                        <li> <img src="./img-me/下载.png" alt=""></li>
                    </ul>
                </div>

            </div>
            <hr>

        </div>
        <div class="cont-right left">
            <div class="conr-top">
                <img src="./img-me/我的资料.png" alt="">
                <span>我的资料</span>
            </div>
            <hr>
            <p><img src="./img-me/我 的.png" class="tongyong">
                <span class="ty">听友12345678</span></p>
            <p><img src="./img-me/朋友.png" class="tongyong">
                <span class="ty">0</span></p>
            <p><img src="./img-me/链接.png" class="tongyong">
                <span class="ty">喜马拉雅个人电台</span>
                <br>
                <span class="teli"> &nbsp;&nbsp;&nbsp; www.baidu.com</span>
                <img src="./img-me/复制.png" alt="" class="teli1"></p>
            <p><img src="./img-me/转发.png" class="tongyong">
                <span class="ty">分享到:</span></p>
            <p>
                <img src="./img-me/朋友圈.png" class="tongyong1 li1">
                <img src="./img-me/微信.png" class="tongyong1">
                <img src="./img-me/微博.png" class="tongyong1">
                <img src="./img-me/qq.png" class="tongyong1">
                <img src="./img-me/空间.png" class="tongyong1">
            </p>
            <p class="next-la"><img src="./img-me/我的.png" class="tongyong">
                <span>我的关注(1)</span></p>
            <hr>

            <div class="img6">

            </div>
        </div>
    </div>
    <!-- 内容end -->
    <!-- 底部footer start -->
    <footer class="wrap">
        <div class="footer-nav clear top30">
            <div class="tubiao clear">
                <ul>
                    <li>
                        <div class="top001"><img class="toowigh" src="../喜马拉雅/image/logo-1.png" alt=""></div>
                        <span>开放平台</span>
                        <p>对接海量精彩内容</p>
                    </li>
                    <li>
                        <div class="top001"><img src="../喜马拉雅/image/logo-2.png" alt=""></div>
                        <span>云剪辑</span>
                        <p>在线音频剪辑神奇</p>
                    </li>
                    <li>
                        <div class="top001"><img src="../喜马拉雅/image/logo-3.jpg" alt=""></div>
                        <span>喜马拉雅大学</span>
                        <p>主播梦想孵化基地</p>
                    </li>
                    <li>
                        <div class="top001"><img src="../喜马拉雅/image/logo-4.png" alt=""></div>
                        <span>小雅智能</span>
                        <p>智能硬件，连接赋能</p>
                    </li>
                    <li>
                        <div class="top001"><img src="../喜马拉雅/image/logo-5.png" alt=""></div>
                        <span>车联网平台</span>
                        <p>自在出行，听我想听</p>
                    </li>
                    <li>
                        <div class="top001"><img src="../喜马拉雅/image/logo-6.png" alt=""></div>
                        <span>企业版</span>
                        <p>员工学习，企业买单</p>
                    </li>
                    <li class="last-c">
                        <div class="top01">
                            <span>手机端</span>
                            <img src="../喜马拉雅/image/二维码1.png" alt="">
                        </div>
                        <div class="top02">
                            <span>电脑端</span>
                            <img src="../喜马拉雅/image/下载.png" alt="">
                        </div>
                    </li>
                </ul>
            </div>

        </div>
        <hr>
        <div class="footer-fot clear ">
            <div class="foot-fot1">
                <span>喜马拉雅是专业的音频分享平台，汇集了有声小说、有声读物、有声书、儿童睡前故事、相声小品、鬼故事等数亿条音频。随时随地，听我想听。</span>
                <img src="../喜马拉雅/image/d_a.gif" alt="">
            </div>
            <div class="foot-fot2">
                <span>地址：上海市浦东新区张江丹桂路799号国创中心三期1-2号楼 客服热线：400-838-5616 举报电话：400-838-5616 《举报受理和处置管理办法》</span>
                <img src="../喜马拉雅/image/d_a.gif" alt="">
            </div>
            <div class="foot-fot3 clear">
                <span>Copyright © 2012-2021 www.ximalaya.com lnc.ALL Rights Reserved</span>
                <i class="xiegang fot3-size left"></i>
                <img src="../喜马拉雅/image/logo-7.png" alt="">
                <a href="#">上海互联网举报中心</a>
                <i class="xiegang fot3-size left"></i>
                <img src="../喜马拉雅/image/logo-8.png" alt="">
                <a href="#">网上有害信息举报专区</a>
                <i class="xiegang fot3-size left"></i>
                <img src="../喜马拉雅/image/logo-9.png" alt="" class="footer-img3">
            </div>
            <div class="foot-fot4  clear">
                <ul>
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#">联系我们</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">求助</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">辟谣</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">公司新闻</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">招贤纳士</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">用户反馈</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">用户服务协议</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">隐私政策</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">版权声明</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">直播平台</a><i class="xiegang footer-fotlast"></i></li>
                    <li><a href="#">自律承诺</a><i class="xiegang footer-fotlast"></i></li>
                </ul>
            </div>

        </div>
    </footer>
    <!-- 底部 footer end -->
    <!-- 侧边栏固定定位start -->
    <div class="dlpc-Tu">
        <img src="./image/图片logo.png" alt="" class="logo-img">
        <div class="text-Tu">云端同步、一键下载 更好的收听体验！</div>
        <a href="#" class="device-btn">下载客户端</a>
    </div>
    <!-- 侧边栏固定定位end -->
</body>

</html>